<template>
  <div>
    <h2>当前求和为：{{result}}</h2>
    <select name="" id="" v-model.number="number">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <button @click="add">+</button>
    <button @click="reduce">-</button>
    <button @click="jiAdd">当前求和为奇数再加</button>
    <button @click="waitAdd">等2秒再加</button>
  </div>
</template>

<script>
export default {
    name:'count',
    data() {
        return {
            result:0,
            number:0,
        }
    },
    methods: {
        add() {
            this.result += this.number;
        },
        reduce() {
            this.result -= this.number;
        },
        jiAdd() {
            if(this.result%2) {
                this.result += this.number;
            }
        },
        waitAdd() {
            setTimeout(() => {
                this.result += this.number;
            },1000)
        }
    },
}
</script>

<style scoped>
    button {
        margin: 0 4px;
    } 
</style>